import React, {Component} from 'react';
import {View, StyleSheet, Text, Image, TouchableOpacity, Platform, Switch} from  'react-native';
let RightArrow = require('../../img/icon_cell_rightarrow.png');
export default class MineCommonCell extends Component {
    constructor(props) {
        super(props);
        this.state = {};
    }

    render() {
        return (

            <TouchableOpacity onPress={()=>{alert("as")}} activeOpacity={0.5}>
                <View style={styles.container}>
                    <View style={styles.leftViewStyle}>
                        <Image source={this.props.leftImage} style={styles.leftImageStyle}/>
                        <Text style={styles.leftTitleStyle}>{this.props.leftTitle}</Text>
                    </View>
                    <View style={styles.rightViewStyle}>
                        {this.renderRightView()}
                    </View>
                </View>
            </TouchableOpacity>
        )
    }

    renderRightView() {
        return (
            <View style={{flexDirection:'row',alignItems:'center'}}>
                {this.renderRightContent()}
                <Image source={RightArrow} style={{width:8,height:13,marginRight:8,marginLeft:5}}/>
            </View>
        )
    }

    renderRightContent() {
        if (this.props.rightTitle == '') {
            return (

                <Image source={this.props.rightImage} style={{width:24,height:13}}/>
            )
        }
        else {
            return (
                <Text style={{color:'gray'}}>{this.props.rightTitle}</Text>
            )
        }
    }


}
MineCommonCell.propTypes = {
    leftImage: React.PropTypes.number,
    leftTitle: React.PropTypes.string,
    rightImage: React.PropTypes.number,
    rightTitle: React.PropTypes.string
};
MineCommonCell.defaultProps = {
    leftImage: null,
    rightImage: null,
    leftTitle: '',
    rightTitle: ''
};
const styles = StyleSheet.create({
    container: {
        flexDirection: 'row',
        justifyContent: 'space-between',
        backgroundColor: 'white',
        alignItems: 'center',
        height: Platform.OS == 'ios' ? 40 : 36,
        borderBottomColor: '#888888',
        borderBottomWidth: 0.5
    },
    leftViewStyle: {
        flexDirection: 'row',
        alignItems: 'center',
        marginLeft: 8
    },
    rightViewStyle: {},
    leftImageStyle: {
        width: 24,
        height: 24,
        marginRight: 6,
        borderRadius: 5
    },
    rightTitleStyle: {},
    leftTitleStyle: {
        fontSize: 16
    }
});

